<!--  -->
<template>
    <div >
        <div class='table-page-search-wrapper'>
            <a-form layout='inline'>
               <a-row :gutter='48'>
                    <a-col :md='8' :sm='24'>
                        <a-form-item label="合同名称">
                            <a-input v-model="contractName" placeholder="请输入合同名称" allow-clear></a-input>
                        </a-form-item>
                    </a-col>
                    <a-col :md='8' :sm='24'>
                    </a-col>
                    <a-col :md='8' :sm='24'>
                        <a-form-item >
                            <a-button type='primary' @click="getData">查询</a-button>
                            <!-- <a-button style="margin-left: 20px" type='' @click="add">添加合同</a-button> -->
                        </a-form-item>
                    </a-col>
                </a-row>
            </a-form>
        </div>  

        <a-table rowKey="id" :loading="isload" :columns="columns" :data-source="dataList" @change="handleTableChange" :pagination="{ 'total': total ,'showSizeChanger': true,'pageSize': size,}" size="small">
            <div slot="remark" slot-scope="remark">
                <ellipsis :length="12" tooltip>{{ remark == '' ? '-' : remark }}</ellipsis>
            </div>
            <div slot="operation" slot-scope="text,record">
                <div class="editable-row-operations">
                    <a-button type="link" @click="detail(record)">查看</a-button>
                </div>
            </div>
        </a-table>
    </div>
</template>

<script>
import { columns } from './table';
import { getCompanyContract } from '@/api/companys/company';
import { Ellipsis } from '@/components';
export default {
    props: ['customerBusinessId'],
    components: {
        Ellipsis,
    },
    data () {
        return {
            contractName: '',
            page: 1,
            size: 10,
            total: 0,
            dataList: [],
            isload: false,
            columns,
        };
    },
    created(){
        this.getData();
    },
    methods: {
        // 获取列表数据
        getData(){
            let _this = this
            const params = {
                'pageSize': _this.size,
                'pageIndex': _this.page,
                'contractName': _this.contractName,
                'customerBusinessId': _this.customerBusinessId,
            }
            getCompanyContract(params)
            .then(res=> {
                if(res.success){
                    _this.dataList = res.data;
                    // _this.total = res.totalCount;
                }else{
                    _this.$notification['error']({
                        message: '温馨提示',
                        description: res.errMessage,
                        duration: 8
                    })
                }
            })
        },
        // 分页
        handleTableChange(pagination, filters, sorter) {
            console.log(pagination);
            this.page = pagination.current;
            this.size = pagination.pageSize;
            this.getData()
        },
        // 查看合同
        detail(item){
            window.open(item.contractUrl);
        },
    }
}

</script>
<style scoped>

</style>